<template>
	<view :class="pageClass"  :style="pageStyle" v-if="pageReady">
		<moxi-nav ref="moxinav" :set="navSet"></moxi-nav>
		<view id="moxi-page-list" v-if="curPagePassword===''||(curPagePassword!==''&&pagePasswordSuccess)">
			<view id="page-modlist" v-for="(list,key) in modData" :class="list.mod_class" :key="key" :style="list.css">
				<moxi-index :list="list"></moxi-index>
			</view> 
		 </view>
		 <view class="password" v-else>
			 <view class="psbox">
				 <u-alert title="当前页面需要输入正确的密码才可访问!" showIcon type = "warning" ></u-alert>
				 	<view class="input">
						<u--input
						   placeholder="请输入访问密码"
						   border="bottom"
						   v-model="ps"
						   clearable
						 ></u--input>
					</view>
					<view class="btn">
						<view style="width: 100%;">
							<u-button text="确认访问" @click="save()" icon="checkbox-mark" iconColor="#fff" :color="app_color"></u-button>
						</view>
					</view>
			 </view>
		
		 </view>
		 <moxi-tabbar :set="tabbar" v-if="tabbar.index_id"></moxi-tabbar>
	 </view>
</template>
<script>      
    export default {
        data() {
            return {
				ps:""
            }
        }
	,mounted(){
		
	},
	onShow(param) {
	
	
	},
	onLoad() {
		let id = 0;
		if(this.param.id){
			id = this.param.id;
		}
		this.moxiPost('/index/app/view',{page:id},(data)=>{},false)
		


	},methods:{
	
		save(){
			if(this.ps !== this.curPagePassword){
				this.msg("访问密码错误");
				return;
			}
			this.moxiCache('page_password_'+this.curPageName,this.ps);
			this.msg("访问密码正确");
			this.pagePasswordSuccess = true;
		}
	}
    }
</script>
<style lang="scss">
	
#page-modlist{display: flex;flex-direction: column;}
.password{
	display: flex;align-items: center;justify-content: center;height: 100%;
}
.psbox{background: #f2f4fc;width: 80%;padding:20px;border-radius: 5px;color: #333;}
.input{display: flex;flex-direction: row;margin-top: 15px;background-color: #fff;}
.btn{text-align: center;display: flex;justify-content: center;margin-top: 15px;}
</style>